
var footer = {
  template: '<footer class="aui-footer aui-footer-fixed">'+
		'<a href="javascript:;" class="aui-tabBar-item">'+
                    '<span class="aui-tabBar-item-icon">'+
                        '<i class="icon icon-loan"></i>'+
                    '</span>'+
			'<span class="aui-tabBar-item-text">首页</span>'+
		'</a>'+
		'<a href="../chat/" class="aui-tabBar-item aui-tabBar-item-active">'+
                    '<span class="aui-tabBar-item-icon">'+
                        '<i class="icon icon-credit"></i>'+
                    '</span>'+
			'<span class="aui-tabBar-item-text">消息</span>'+
		'</a>'+
		'<a href="javascript:;" class="aui-tabBar-item ">'+
                    '<span class="aui-tabBar-item-icon">'+
                        '<i class="icon icon-ions"></i>'+
                    '</span>'+
			'<span class="aui-tabBar-item-text">资讯</span>'+
		'</a>'+

		'<a href="../content/personal/" class="aui-tabBar-item ">'+
                    '<span class="aui-tabBar-item-icon">'+
                        '<i class="icon icon-meTo"></i>'+
                    '</span>'+
			'<span class="aui-tabBar-item-text">我的</span>'+
		'</a>'+
	'</footer>'
};

const itemMenu = {
	props : ['text'],
	template: '<div class="ps-lt">'+
				'<div class="lt-dsb">'+
				    '<p>{{ text }}</p>'+
				    '<i class="arr-right"></i>'+
				'</div>'+
			'</div>'
}

const searchItem = {
	props : ['user'],
	template: '<div class="search-user-item" v-if="user.userinfo != null">'+
	   				'<div class="avator avator-lg"><img class="item-avator" :src="user.userinfo.headpic"/></div>'+
	   				'<div class="search-message">'+
	   				'<div class="name"><span class="label label-name">昵称</span>{{ user.userinfo.nickName }}</div>'+
	   				'<div class="description" :title="user.userinfo.description"><span class="label label-description">介绍</span>{{ user.userinfo.description ? user.userinfo.description: "这人很懒什么也没留下" }}</div>'+
	   				'<div class="sex"><span class="label label-sex">性别</span>{{ user.userinfo.sex ? "男": "女" }}</div>'+
	   				'</div>'+
	   				'<div class="btn-group">'+
	   				'<a href="#" v-on:click="requestUser(user.id)" :index="user.id"><div class="request">申请好友</div></a>'+
	   				'<a href="#"><div class="detail">详细资料</div></a>'+
	   				'</div>'+
	   			'</div>',
	methods: {
		requestUser: function(id,e) {
	    	var that = this;
	    	util.tokenPost("https://www.maksdu.com/app/communicate/add", {targetUserId:id}, function(result){
	    		if(result.value) {

	    		}
	    	})
	    }
	}
}

function keepLastIndex(el) {
	                
	if (window.getSelection) { //ie11 10 9 ff safari
        el.focus(); //解决ff不获取焦点无法定位问题
        var range = window.getSelection(); //创建range
        range.selectAllChildren(el); //range 选择obj下所有子内容
        range.collapseToEnd(); //光标移至最后
    } else if (document.selection) { //ie10 9 8 7 6 5
        var range = document.selection.createRange(); //创建选择对象
        //var range = document.body.createTextRange();
        range.moveToElementText(el); //range定位到obj
        range.collapse(false); //光标移至最后
        range.select();
    }
				  
}

var util = {
	post: function(urls, param, callback) {
		$.ajax({
			url: urls,
			data: param,
			method: 'post',
			success: function(data) {
				callback(data.result);
			}
		})
	},
	tokenPost: function(urls, params, callback) {
		var that = this;
		$.ajax({
			url: urls,
			data: params,
			method: 'post',
			headers: {
				'request_access_token': that.local('token')
			},
			success: function(data) {
				callback(data.result);
			}
		})
	},
	local: function(key) {
		return window.localStorage.getItem(key);
	}
}

var vueApp = new Vue({
	el: '#main',
	components: {
		'fcomponent':footer,
		'item': itemMenu,
		'searchitem': searchItem
	},
	data : {
		title: '我的好友',
		searchItem: '',
		message: '',
		icon_show: false,
		iclear: false,
		hasResult: false,
		searchList:[],
		friendIds:[],
		fids:[],
		itemList:[
			{'text':'邀请'},
			{'text':'手机联系人'},
			{'text':'同班同学'},
			{'text':'兴趣部落'},
			{'text':'按条件查询'}
		]
	},
	directives: {	    
		focus: {	        
			inserted: function (el, {value}) {	        	          
				if (value) {	                
					keepLastIndex(el);
				}	        
			}	    
		}	
	},
	created: function() {
		this.reset();
	},
	mounted: function() {
		this.init();
	},
	methods: {
		init: function() {
			util.tokenPost("https://www.maksdu.com/app/communicate/get",null,function(result){
				console.info(result);
			})
		},
		reset: function(){
			//this.icon_show = false;
			this.iclear = false;
		},
		iconShow: function() {
			if(!this.icon_show)
				this.icon_show = true
			else
				this.icon_show = false
		},
		inputInit: function(e) {
			this.searchItem = "";
			this.icon_show = true;
			this.iclear = true;
		},
		inputValue: function(e) {
			if(!this.icon_show) {
				this.inputInit();
			}
			this.searchItem = e.target.innerHTML;
			if(this.searchItem == "<br>") {
				this.searchItem = "";
			}
			setTimeout(()=>{
			    this.keepLastIndex(e.target);
			},5);
		},
		keepLastIndex: function(obj) {
	        keepLastIndex(obj);
	    },
	    getShow: function() {
	    	return !this.icon_show;
	    },
	    searchItemList: function(e) {
	    	var that = this;
	    	util.post("https://www.maksdu.com/app/search",{userinfo:this.searchItem},function(result) {
	    		if(result.value) {
	    			that.hasResult = true;
	    			that.searchList = result.value;
	    			that.icon_show = false;
	    			console.info(that.searchList);
	    		}	
	    	});
	    }
	}
})

